<template>
    <div class="bgc">
    <div class="cusDetails">



        <div class="topS">
            <div class="left_user">
                <img src="../../../public/login/login_2.png" alt="" class="user">
                <p class="text">{{ route.query.subPerson}}</p>
                <p class="text1">{{ route.query.subTime }}</p>
            </div>
            <div class="xian"></div>
            <div class="left_user">
                <img src="../../../public/login/login_2.png" alt="" class="user">
                <p class="text">{{ route.query.subPerson}}</p>
                <p class="text1">{{ route.query.subTime }}</p>
            </div>
        </div>









        <div class="top">
            <!-- //客户名 -->
            <div class="top_t">
                <!-- 客户名 -->
                <h3 class="top_h">
                    深圳市亿恩科技有限公司
                </h3>
                <svg t="1710070241070" class="icon" viewBox="0 0 1024 1024" version="1.1"
                    xmlns="http://www.w3.org/2000/svg" p-id="13287" width="200" height="200">
                    <path
                        d="M512 1024a512 512 0 1 1 512-512 512 512 0 0 1-512 512z m281.875692-697.856a36.548923 36.548923 0 0 0-51.712 0l-294.163692 294.163692-166.163692-166.163692a36.548923 36.548923 0 0 0-51.712 51.712l191.684923 191.645538 0.354461 0.393847a36.588308 36.588308 0 0 0 51.712 0l0.354462-0.393847 319.645538-319.645538a36.548923 36.548923 0 0 0 0-51.712z"
                        fill="#3377FF" p-id="13288"></path>
                </svg>
                <span class="top_span">
                    客户网络资讯
                </span>
            </div>
            <!-- //客户归属 -->

            <ul class="top_ul">
                <li>客户归属:<span>赵小刚</span></li>
                <li>首联系人:<span>李小红</span></li>
                <li>下次跟进:<span>2019-04-15 12:00</span></li>
            </ul>
            <!-- 功能 -->
            <div class="top-btn">
                <el-button><svg t="1710071992250" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="14266" width="15" height="15   ">
                        <path
                            d="M960.621531 575.791885 571.769268 575.791885l0 382.755404-120.688733 0L451.080535 575.791885 64.875566 575.791885 64.875566 448.207092l386.204969 0L451.080535 65.451688l120.688733 0 0 382.755404 388.853285 0L960.622554 575.791885z"
                            fill="#3A2E2E" p-id="14267"></path>
                    </svg>添加</el-button>
                <el-button> <svg t="1710072429483" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="20406" width="15" height="15">
                        <path
                            d="M904 512h-56c-4.4 0-8 3.6-8 8v320H184V184h320c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V520c0-4.4-3.6-8-8-8z"
                            p-id="20407"></path>
                        <path
                            d="M355.9 534.9L354 653.8c-0.1 8.9 7.1 16.2 16 16.2h0.4l118-2.9c2-0.1 4-0.9 5.4-2.3l415.9-415c3.1-3.1 3.1-8.2 0-11.3L785.4 114.3c-1.6-1.6-3.6-2.3-5.7-2.3s-4.1 0.8-5.7 2.3l-415.8 415c-1.4 1.5-2.3 3.5-2.3 5.6z m63.5 23.6L779.7 199l45.2 45.1-360.5 359.7-45.7 1.1 0.7-46.4z"
                            p-id="20408"></path>
                    </svg>写新跟进</el-button>
                <el-button><svg t="1710072559238" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="31408" width="15" height="15">
                        <path
                            d="M682.666667 682.666667v-42.666667h85.333333v170.666667h-85.333333v-42.666667H170.666667v-85.333333h512z m128 0h85.333333v85.333333h-85.333333v-85.333333z m-341.333334-213.333334v-42.666666h85.333334v170.666666h-85.333334v-42.666666H170.666667v-85.333334h298.666666z m128 0h298.666667v85.333334h-298.666667v-85.333334zM256 256V213.333333h85.333333v170.666667H256V341.333333H170.666667V256h85.333333z m128 0h512v85.333333H384V256z"
                            fill="#444444" p-id="31409"></path>
                    </svg>新建任务</el-button>
                <el-button><svg t="1710072675623" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="35863" width="10" height="10">
                        <path d="M0 0h1024v1024H0z" fill="#333333" fill-opacity="0" p-id="35864"></path>
                        <path
                            d="M177.12 716.8a35.68 35.68 0 0 1-32-19.84 400 400 0 0 1-30.72-81.44A411.04 411.04 0 0 1 741.76 171.2a36 36 0 1 1-40.32 59.68A339.04 339.04 0 0 0 172.96 512a339.84 339.84 0 0 0 10.88 85.44 347.2 347.2 0 0 0 25.28 67.2 35.84 35.84 0 0 1-16 48 36.8 36.8 0 0 1-16 4.16zM512 923.04a406.24 406.24 0 0 1-256-89.28 36 36 0 0 1 44.8-56.32 336 336 0 0 0 211.2 73.6 339.04 339.04 0 0 0 294.4-507.2 36 36 0 0 1 62.56-35.68A411.04 411.04 0 0 1 512 923.04z"
                            fill="#323333" p-id="35865"></path>
                        <path
                            d="M290.328311 499.825693m24.702641 20.341571l0 0q24.702641 20.341572 4.361069 45.044213l-115.235003 139.94046q-20.341572 24.702641-45.044212 4.36107l0 0q-24.702641-20.341572-4.36107-45.044213l115.235003-139.94046q20.341572-24.702641 45.044213-4.36107Z"
                            fill="#333333" p-id="35866"></path>
                        <path
                            d="M831.330685 276.857577m24.702641 20.341571l0 0q24.702641 20.341572 4.361069 45.044213l-115.235002 139.94046q-20.341572 24.702641-45.044213 4.36107l0 0q-24.702641-20.341572-4.361069-45.044213l115.235003-139.94046q20.341572-24.702641 45.044212-4.36107Z"
                            fill="#333333" p-id="35867"></path>
                    </svg>转移客户</el-button>
                <el-button><svg t="1710072746504" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="39468" width="15" height="15">
                        <path
                            d="M800 825.6c0 0 0-115.2-19.2-140.8-12.8-19.2-25.6-38.4-51.2-51.2 0-12.8 0-32 0-32s-12.8-12.8-25.6-44.8c-19.2-6.4-19.2-12.8-19.2-25.6 0 0-6.4-44.8 6.4-44.8 0 0 6.4-6.4 6.4-12.8 0-19.2-6.4-44.8 0-57.6 0-12.8-6.4-38.4 19.2-44.8 25.6-6.4 12.8 0 25.6-6.4 6.4 0 6.4-6.4 19.2-6.4l32-6.4c12.8 0 25.6 12.8 32 19.2 6.4 0-6.4-6.4 12.8 0 25.6 6.4 19.2 38.4 19.2 51.2 0 12.8 0 44.8 0 57.6 0 12.8 12.8 6.4 12.8 6.4 12.8-6.4 6.4 44.8 6.4 44.8 0 12.8 6.4 12.8-6.4 25.6C857.6 582.4 832 601.6 832 601.6s0 25.6 0 25.6c0 0-12.8 38.4 57.6 44.8 70.4 12.8 76.8 32 89.6 44.8 38.4 25.6 44.8 102.4 44.8 102.4S889.6 825.6 800 825.6zM633.6 480C620.8 518.4 576 537.6 576 537.6S576 569.6 576 576c0 0-12.8 51.2 64 64 89.6 12.8 96 38.4 108.8 57.6 19.2 12.8 12.8 128 12.8 128l-512 0c0 0 0-102.4 12.8-128 0-6.4 19.2-44.8 108.8-57.6C460.8 620.8 441.6 576 448 576c0-19.2 0-44.8 0-44.8S396.8 518.4 384 480C352 467.2 358.4 460.8 352 448 352 448 345.6 384 364.8 384 364.8 384 384 384 384 371.2c0-25.6 0-64 6.4-83.2 0-12.8 12.8-57.6 44.8-64 32-6.4 19.2 0 32-6.4 12.8 0 6.4-6.4 25.6-6.4l38.4-19.2c19.2 0 32 38.4 44.8 38.4 12.8 0 12.8-6.4 32 0C640 243.2 640 288 640 300.8 640 320 640 364.8 640 377.6c0 12.8 6.4 12.8 6.4 12.8 25.6 0 19.2 57.6 19.2 57.6C665.6 460.8 652.8 460.8 633.6 480zM320 556.8C307.2 582.4 288 601.6 288 601.6s0 19.2 0 32c-25.6 12.8-32 32-44.8 51.2-19.2 51.2-19.2 140.8-19.2 140.8-89.6 0-224 0-224 0s0-76.8 44.8-102.4c12.8-12.8 25.6-32 89.6-44.8C198.4 665.6 192 633.6 192 627.2c0-6.4 0-25.6 0-25.6S166.4 582.4 153.6 550.4C140.8 544 140.8 537.6 140.8 524.8c0 0 0-38.4 12.8-38.4 0 0 6.4 0 6.4-6.4 0-12.8 0-44.8 0-57.6 0-12.8 0-44.8 19.2-51.2 19.2 0 0 0 12.8 0 6.4 0 19.2-19.2 32-19.2l32 6.4c12.8 0 12.8 6.4 19.2 6.4 6.4 0 0 0 25.6 6.4C326.4 371.2 320 396.8 320 409.6c0 12.8 0 38.4 0 57.6 0 12.8 12.8 12.8 12.8 12.8 12.8 0 6.4 44.8 6.4 44.8C332.8 537.6 339.2 544 320 556.8z"
                            p-id="39469"></path>
                    </svg> 移入公海</el-button>
                <el-button><svg t="1710072838253" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="46972" width="15" height="15">
                        <path
                            d="M892.7 896.1H131.3c-18.4 0-33.3-14.9-33.3-33.3V696.4c0-18.4 14.9-33.3 33.3-33.3h30c18.4 0 33.3 14.9 33.3 33.3 0 4.5-0.9 8.9-2.6 12.8l-13 64.9c0 18.4 14.9 33.3 33.3 33.3h599.3c18.4 0 33.3-14.9 33.3-33.3l-13-64.9c-1.7-4-2.6-8.3-2.6-12.8 0-18.4 14.9-33.3 33.3-33.3h30c18.4 0 33.3 14.9 33.3 33.3v166.5c0.1 18.3-14.8 33.2-33.2 33.2zM580 582h1l-1 0.9v-0.9z m247.2-228.6l1.6 0.1-234.7 216.4v-2.3h-0.1c-0.3 3.7-3.4 6.7-7.2 6.7-4 0-7.2-3.2-7.2-7.2 0-0.7 0.1-1.3 0.3-1.9V433.3c-11.4-0.7-23-1.1-34.7-1.1-134.7 0-247.2 95.2-273.7 222.1-12.1-18.3-17.1-49.1-17.1-100 0-154.5 125.2-294.1 279.7-294.1 15.8 0 31.1 0.1 45.8 0.4V136.1c-0.2-0.6-0.3-1.2-0.3-1.9 0-4 3.2-7.2 7.2-7.2 3.8 0 6.9 2.9 7.2 6.7h0.1v-1.8L829.6 339h-2.4v0.1c3.7 0.3 6.7 3.4 6.7 7.2 0 3.7-3 6.8-6.7 7.1z"
                            fill="" p-id="46973"></path>
                    </svg>添加协作</el-button>
                <el-button> <svg t="1710072904371" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="48884" width="15" height="15">
                        <path
                            d="M823.135226 106.515942 195.565071 106.515942c-71.733765 0-130.09087 63.59848-130.09087 141.771911l0 402.309762c0 78.171384 58.358129 141.769864 130.09087 141.769864l20.697391 0L216.262462 898.128221c0 31.728632 23.611767 57.547671 52.629661 57.547671 10.321066 0 20.581758-3.5038 29.436426-9.965979l216.755696-153.341411 308.055075 0c71.731718 0 130.09087-63.59848 130.09087-141.769864L953.23019 248.288876C953.225073 170.114422 894.867968 106.515942 823.135226 106.515942L823.135226 106.515942zM332.590887 407.282007c21.366633 0 38.688137 18.877953 38.688137 42.163285 0 23.283286-17.321504 42.162262-38.688137 42.162262-21.36254 0-38.689161-18.877953-38.689161-42.162262C293.900703 426.15996 311.228347 407.282007 332.590887 407.282007L332.590887 407.282007zM509.351684 491.607554c-21.366633 0-38.689161-18.877953-38.689161-42.162262 0-23.285333 17.322527-42.163285 38.689161-42.163285 21.36561 0 38.683021 18.877953 38.683021 42.163285C548.034704 472.729601 530.717294 491.607554 509.351684 491.607554L509.351684 491.607554zM686.10941 491.607554c-21.366633 0-38.689161-18.877953-38.689161-42.162262 0-23.285333 17.322527-42.163285 38.689161-42.163285 21.36561 0 38.688137 18.877953 38.688137 42.163285C724.797547 472.729601 707.47502 491.607554 686.10941 491.607554L686.10941 491.607554zM686.10941 491.607554"
                            fill="#262535" p-id="48885"></path>
                    </svg>发送短信</el-button>
                <el-button>☆重点关注</el-button>
                <el-button><svg t="1710072970227" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="49904" width="15" height="15">
                        <path
                            d="M259.882667 650.666667a41.301333 41.301333 0 0 1 1.237333-2.901334 13.525333 13.525333 0 0 1 1.237333-1.792l310.144-536.064a128 128 0 1 1 221.696 128l-309.76 535.552a49.578667 49.578667 0 0 1-28.842666 25.429334l-146.602667 81.92a39.466667 39.466667 0 0 1-52.224-30.165334v-166.954666a65.408 65.408 0 0 1 3.114667-33.024z m306.901333-445.525334L311.381333 647.722667l147.2 86.186666 256-443.434666-147.797333-85.333334z m21.333333-36.949333l147.797334 85.333333 21.333333-36.949333-147.797333-85.333333-21.333334 36.949333z m21.333334-36.949333l147.797333 85.333333a85.333333 85.333333 0 0 0-147.797333-85.333333zM301.098667 692.224L298.666667 839.424l125.696-76.032-123.306667-71.168zM64 938.666667h896a21.333333 21.333333 0 1 1 0 42.666666h-896a21.333333 21.333333 0 1 1 0-42.666666z"
                            fill="#000000" fill-opacity=".65" p-id="49905"></path>
                    </svg>编辑客户</el-button>
                <el-button><svg t="1710073008042" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="50908" width="15" height="15">
                        <path
                            d="M542.42816 742.48704l-335.91808 0.80896v-1.11104c0-120.69376 102.43072-229.15072 222.68928-230.99392 0.45568 0 0.9216 0.06144 1.40288 0.06144 1.13152 0 2.24256-0.16896 3.36896-0.16896 43.46368 0.27136 89.10336 13.1584 123.2128 35.16928 11.6992-14.90432 14.8992-26.46528 30.90944-36.7104-18.54976-13.3888-32.96768-20.74112-54.54848-29.2608 38.19008-30.39232 62.75072-77.12768 62.75072-129.60768 0-91.37664-74.32192-165.7088-165.69344-165.7088-91.38176 0-165.70368 74.33216-165.70368 165.7088 0 53.0432 25.1648 100.21376 64.05632 130.5856-101.06368 41.07264-172.55424 140.1856-172.55424 255.80544v28.7232a27.5968 27.5968 0 0 0 27.6224 27.61216h400.75776c-20.0704-14.7968-30.44864-28.80512-42.35264-50.91328zM315.01312 350.6688c0-60.92288 54.66624-115.58912 115.59424-115.58912 60.92288 0 115.584 54.66624 115.584 115.58912 0 60.13952-53.4784 114.12992-113.31584 115.36384-0.10752 0-0.19968-0.0256-0.30208-0.0256-0.9728 0-1.94048 0.14336-2.91328 0.14336-60.45696-0.51712-114.64704-54.88128-114.64704-115.4816z"
                            fill="#2D2D2D" p-id="50909"></path>
                        <path
                            d="M729.8304 482.20672a169.53856 169.53856 0 0 0-170.12224 170.13248 169.53344 169.53344 0 0 0 170.12224 170.12736 169.5488 169.5488 0 0 0 170.13248-170.12736 169.55904 169.55904 0 0 0-170.13248-170.13248z m71.11168 241.24416c-4.58752 4.59264-12.41088 4.59264-17.00864 0l-54.09792-54.10304-54.10816 54.10304c-4.5824 4.59264-12.41088 4.59264-16.9984 0-4.59776-4.59264-4.59776-12.42624 0-17.01888l54.08768-54.0928-54.08768-54.10304c-4.59776-4.59264-4.59776-12.416 0-17.00864 4.58752-4.59264 12.42112-4.59264 16.9984 0l54.10816 54.0928 54.09792-54.0928c4.59776-4.59264 12.42112-4.59264 17.00864 0 4.59776 4.59264 4.59776 12.416 0 17.00864l-54.09792 54.10304 54.09792 54.0928c6.2976 4.59264 6.2976 13.09696 0 17.01888z"
                            fill="#2C2C2C" p-id="50910"></path>
                        <path
                            d="M452.34688 542.15168l-38.91712-0.40448-19.41504-4.26496 24.52992 31.62624-21.0176 108.48256 33.60256 27.52 32.05632-26.83392-13.83936-108.84096 22.48704-31.1296-19.48672 3.84512z m0 0"
                            fill="#2D2D2D" p-id="50911"></path>
                    </svg>删除客户</el-button>

            </div>
        </div>



    


<div class="topSS">
<ul class="ull">
    <li>
        <span class="AAQ">工单编号</span>
        <span>{{ route.query.workNum }}</span>
        <span class="AAQ">紧急程度</span>
        <span>{{ route.query.urgent }}</span>
    </li>
   
    <li>
        <span class="AAQ">关联客户</span>
        <span>深圳市亿恩科技有限公司</span>
        <span class="AAQ">联系人</span>
        <span>{{ route.query.subPerson }}</span>
    </li>
    <li>
        <span class="AAQ">当前状态</span>
        <span>{{ route.query.current_status }}</span>
        <span class="AAQ">提交时间</span>
        <span>{{ route.query.subTime }}</span>
    </li>
</ul>
</div>




        <div class="con"> <a-tabs v-model:activeKey="activeKey">

                <a-tab-pane key="1" tab="概况信息">
                    <div class="cons">
                        <h3><span class="iconfont icon-tianchongxing-"></span> 基本信息</h3>
                        <OrderListMsg :list="listOne" />
                        <h3><span class="iconfont icon-tianchongxing-"></span> 首联系人</h3>
                        <OrderListMsg :list="listTwo" />
                        <!-- 客户动态 -->
                        <h3><span class="iconfont icon-tianchongxing-"></span> 客户动态</h3>
                        <ul class="ul_ke">
                            <li class="lia">
                                <svg t="1710151119095" class="icon svg" viewBox="0 0 1024 1024" version="1.1"
                                    xmlns="http://www.w3.org/2000/svg" p-id="6200" width="12" height="12">
                                    <path
                                        d="M512 512m-486.61240522 0a486.61240522 486.61240522 0 1 0 973.22481044 0 486.61240522 486.61240522 0 1 0-973.22481044 0Z"
                                        fill="#074bf3" p-id="6201"
                                        data-spm-anchor-id="a313x.search_index.0.i24.11223a8162kAU9" class=""></path>
                                    <path
                                        d="M512 512m-290.37109839 0a290.37109839 290.37109839 0 1 0 580.74219678 0 290.37109839 290.37109839 0 1 0-580.74219678 0Z"
                                        fill="#ffffff" p-id="6202"
                                        data-spm-anchor-id="a313x.search_index.0.i23.11223a8162kAU9" class="selected">
                                    </path>
                                </svg>
                                <div class="lia_top">
                                    <div class="lia_left"> <svg t="1710075427091" class="icon" viewBox="0 0 1024 1024"
                                            version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="52886" width="30"
                                            height="30">
                                            <path
                                                d="M512 0C229.236338 0 0 229.236338 0 512s229.236338 512 512 512 512-229.224912 512-512S794.775088 0 512 0z m-6.443844 190.801776c94.681097 0 171.710173 75.886551 171.710173 169.185192s-77.029076 169.208042-171.710173 169.208042-171.698748-75.909401-171.698749-169.185191S410.886484 190.801776 505.556156 190.801776zM793.141276 771.638944c0 61.536429-100.473702 61.536429-216.817084 61.536429H447.664383c-121.107714 0-216.794234 0-216.794234-61.536429v-12.670609c0-117.680137 97.240354-213.48091 216.794234-213.480909h128.659809c119.553879 0 216.817084 95.777922 216.817084 213.480909z"
                                                fill="#e5e5e5" p-id="52887"></path>
                                            <path
                                                d="M576.324192 545.487426H447.664383c-119.553879 0-216.794234 95.755071-216.794234 213.480909v12.670609c0 61.536429 95.68652 61.536429 216.794234 61.536429h128.659809c116.343383 0 216.817084 0 216.817084-61.536429v-12.670609c0-117.702988-97.263205-213.48091-216.817084-213.480909zM505.556156 529.19501c94.681097 0 171.710173-75.875126 171.710173-169.185191S600.237253 190.801776 505.556156 190.801776s-171.698748 75.932252-171.698749 169.208043 77.029076 169.185192 171.698749 169.185191z"
                                                fill="#ffffff" p-id="52888"></path>
                                        </svg>
                                        <span>赵小刚</span>&nbsp;
                                        <span>跟进（到访）</span>
                                    </div>
                                    <div class="lia_right">
                                        <svg t="1710075771209" class="icon" viewBox="0 0 1024 1024" version="1.1"
                                            xmlns="http://www.w3.org/2000/svg" p-id="53904" width="15" height="15">
                                            <path
                                                d="M675.328 117.717333A425.429333 425.429333 0 0 0 512 85.333333C276.352 85.333333 85.333333 276.352 85.333333 512s191.018667 426.666667 426.666667 426.666667 426.666667-191.018667 426.666667-426.666667c0-56.746667-11.093333-112-32.384-163.328a21.333333 21.333333 0 0 0-39.402667 16.341333A382.762667 382.762667 0 0 1 896 512c0 212.074667-171.925333 384-384 384S128 724.074667 128 512 299.925333 128 512 128c51.114667 0 100.8 9.984 146.986667 29.12a21.333333 21.333333 0 0 0 16.341333-39.402667zM533.333333 362.666667a21.333333 21.333333 0 0 0-42.666666 0v170.666666a21.333333 21.333333 0 0 0 6.250666 15.082667l128 128a21.333333 21.333333 0 0 0 30.165334-30.165333L533.333333 524.501333V362.666667z"
                                                fill="#3D3D3D" p-id="53905"></path>
                                        </svg>
                                        <span>2019-03-23 22:31</span>
                                    </div>
                                </div>
                                <div class="lia_con">
                                    上门拜访了客户，客户对产品意向很高，但是希望价格能有优惠。
                                </div>
                                <div class="lia_btn">
                                    <span>来自客户:{{ "深圳市亿恩科技有限公司" }}</span>
                                    <div class="btn_tn">
                                        <el-button><svg t="1710076963285" class="icon" viewBox="0 0 1024 1024"
                                                version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="62532" width="15"
                                                height="15">
                                                <path
                                                    d="M682.666667 536.746667l-235.52 220.586666a35.84 35.84 0 0 1-49.066667-52.48L603.733333 512 395.946667 315.733333a35.84 35.84 0 1 1 49.066666-52.48L682.666667 484.266667a35.84 35.84 0 0 1 0 52.48zM512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z"
                                                    fill="#5E5C5C" p-id="62533"></path>
                                            </svg>详情</el-button>
                                        <el-button><svg t="1710077010151" class="icon" viewBox="0 0 1024 1024"
                                                version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="64484" width="15"
                                                height="15">
                                                <path
                                                    d="M512 0C226.742857 0 0 197.485714 0 446.171429c0 138.971429 73.142857 270.628571 190.171429 351.085714L190.171429 1024l226.742857-138.971429c29.257143 7.314286 65.828571 7.314286 95.085714 7.314286 285.257143 0 512-197.485714 512-446.171429C1024 197.485714 797.257143 0 512 0zM256 512C219.428571 512 190.171429 482.742857 190.171429 446.171429S219.428571 380.342857 256 380.342857c36.571429 0 65.828571 29.257143 65.828571 65.828571S292.571429 512 256 512zM512 512C475.428571 512 446.171429 482.742857 446.171429 446.171429S475.428571 380.342857 512 380.342857c36.571429 0 65.828571 29.257143 65.828571 65.828571S548.571429 512 512 512zM768 512C731.428571 512 702.171429 482.742857 702.171429 446.171429s29.257143-65.828571 65.828571-65.828571c36.571429 0 65.828571 29.257143 65.828571 65.828571S804.571429 512 768 512z"
                                                    p-id="64485"></path>
                                            </svg>评论</el-button>
                                    </div>
                                </div>
                            </li>
                            <li class="lia">
                                <svg t="1710151119095" class="icon svg" viewBox="0 0 1024 1024" version="1.1"
                                    xmlns="http://www.w3.org/2000/svg" p-id="6200" width="12" height="12">
                                    <path
                                        d="M512 512m-486.61240522 0a486.61240522 486.61240522 0 1 0 973.22481044 0 486.61240522 486.61240522 0 1 0-973.22481044 0Z"
                                        fill="#074bf3" p-id="6201"
                                        data-spm-anchor-id="a313x.search_index.0.i24.11223a8162kAU9" class=""></path>
                                    <path
                                        d="M512 512m-290.37109839 0a290.37109839 290.37109839 0 1 0 580.74219678 0 290.37109839 290.37109839 0 1 0-580.74219678 0Z"
                                        fill="#ffffff" p-id="6202"
                                        data-spm-anchor-id="a313x.search_index.0.i23.11223a8162kAU9" class="selected">
                                    </path>
                                </svg>
                                <div class="lia_top">
                                    <div class="lia_left"> <svg t="1710075427091" class="icon" viewBox="0 0 1024 1024"
                                            version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="52886" width="30"
                                            height="30">
                                            <path
                                                d="M512 0C229.236338 0 0 229.236338 0 512s229.236338 512 512 512 512-229.224912 512-512S794.775088 0 512 0z m-6.443844 190.801776c94.681097 0 171.710173 75.886551 171.710173 169.185192s-77.029076 169.208042-171.710173 169.208042-171.698748-75.909401-171.698749-169.185191S410.886484 190.801776 505.556156 190.801776zM793.141276 771.638944c0 61.536429-100.473702 61.536429-216.817084 61.536429H447.664383c-121.107714 0-216.794234 0-216.794234-61.536429v-12.670609c0-117.680137 97.240354-213.48091 216.794234-213.480909h128.659809c119.553879 0 216.817084 95.777922 216.817084 213.480909z"
                                                fill="#e5e5e5" p-id="52887"></path>
                                            <path
                                                d="M576.324192 545.487426H447.664383c-119.553879 0-216.794234 95.755071-216.794234 213.480909v12.670609c0 61.536429 95.68652 61.536429 216.794234 61.536429h128.659809c116.343383 0 216.817084 0 216.817084-61.536429v-12.670609c0-117.702988-97.263205-213.48091-216.817084-213.480909zM505.556156 529.19501c94.681097 0 171.710173-75.875126 171.710173-169.185191S600.237253 190.801776 505.556156 190.801776s-171.698748 75.932252-171.698749 169.208043 77.029076 169.185192 171.698749 169.185191z"
                                                fill="#ffffff" p-id="52888"></path>
                                        </svg>
                                        <span>赵小刚</span>&nbsp;
                                        <span>跟进（到访）</span>
                                    </div>
                                    <div class="lia_right">
                                        <svg t="1710075771209" class="icon" viewBox="0 0 1024 1024" version="1.1"
                                            xmlns="http://www.w3.org/2000/svg" p-id="53904" width="15" height="15">
                                            <path
                                                d="M675.328 117.717333A425.429333 425.429333 0 0 0 512 85.333333C276.352 85.333333 85.333333 276.352 85.333333 512s191.018667 426.666667 426.666667 426.666667 426.666667-191.018667 426.666667-426.666667c0-56.746667-11.093333-112-32.384-163.328a21.333333 21.333333 0 0 0-39.402667 16.341333A382.762667 382.762667 0 0 1 896 512c0 212.074667-171.925333 384-384 384S128 724.074667 128 512 299.925333 128 512 128c51.114667 0 100.8 9.984 146.986667 29.12a21.333333 21.333333 0 0 0 16.341333-39.402667zM533.333333 362.666667a21.333333 21.333333 0 0 0-42.666666 0v170.666666a21.333333 21.333333 0 0 0 6.250666 15.082667l128 128a21.333333 21.333333 0 0 0 30.165334-30.165333L533.333333 524.501333V362.666667z"
                                                fill="#3D3D3D" p-id="53905"></path>
                                        </svg>
                                        <span>2019-03-23 22:31</span>
                                    </div>
                                </div>
                                <div class="lia_con">
                                    上门拜访了客户，客户对产品意向很高，但是希望价格能有优惠。
                                </div>
                                <div class="lia_btn">
                                    <span>来自客户:{{ "深圳市亿恩科技有限公司" }}</span>
                                    <div class="btn_tn">
                                        <el-button><svg t="1710076963285" class="icon" viewBox="0 0 1024 1024"
                                                version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="62532" width="15"
                                                height="15">
                                                <path
                                                    d="M682.666667 536.746667l-235.52 220.586666a35.84 35.84 0 0 1-49.066667-52.48L603.733333 512 395.946667 315.733333a35.84 35.84 0 1 1 49.066666-52.48L682.666667 484.266667a35.84 35.84 0 0 1 0 52.48zM512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z"
                                                    fill="#5E5C5C" p-id="62533"></path>
                                            </svg>详情</el-button>
                                        <el-button><svg t="1710077010151" class="icon" viewBox="0 0 1024 1024"
                                                version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="64484" width="15"
                                                height="15">
                                                <path
                                                    d="M512 0C226.742857 0 0 197.485714 0 446.171429c0 138.971429 73.142857 270.628571 190.171429 351.085714L190.171429 1024l226.742857-138.971429c29.257143 7.314286 65.828571 7.314286 95.085714 7.314286 285.257143 0 512-197.485714 512-446.171429C1024 197.485714 797.257143 0 512 0zM256 512C219.428571 512 190.171429 482.742857 190.171429 446.171429S219.428571 380.342857 256 380.342857c36.571429 0 65.828571 29.257143 65.828571 65.828571S292.571429 512 256 512zM512 512C475.428571 512 446.171429 482.742857 446.171429 446.171429S475.428571 380.342857 512 380.342857c36.571429 0 65.828571 29.257143 65.828571 65.828571S548.571429 512 512 512zM768 512C731.428571 512 702.171429 482.742857 702.171429 446.171429s29.257143-65.828571 65.828571-65.828571c36.571429 0 65.828571 29.257143 65.828571 65.828571S804.571429 512 768 512z"
                                                    p-id="64485"></path>
                                            </svg>评论</el-button>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </a-tab-pane>
                <!-- 资料详情 -->
                <a-tab-pane key="2" tab="资料详情" force-render>
                    <div class="cons">
                        <h3><span class="iconfont icon-tianchongxing-"></span> 首联系人</h3>
                        <OrderListMsg :list="ListKe" />
                        <h3><span class="iconfont icon-tianchongxing-"></span> 附加信息</h3>
                        <OrderListMsg :list="ListFu" />
                        <h3><span class="iconfont icon-tianchongxing-"></span> 财务信息</h3>
                        <OrderListMsg :list="ListCai" />
                        <h3><span class="iconfont icon-tianchongxing-"></span> 系统信息</h3>
                        <OrderListMsg :list="ListXi" />
                    </div>

                </a-tab-pane>
                <a-tab-pane key="3" tab="联系人">
                    <Table :data="tabelData" :columns="columns"></Table>
                </a-tab-pane>
                <a-tab-pane key="4"> tab="下级客户">Content of Tab Pane 3</a-tab-pane>
                <a-tab-pane key="5" tab="跟进记录">Content of Tab Pane 3</a-tab-pane>
                <a-tab-pane key="6" tab="联系记录">Content of Tab Pane 3</a-tab-pane>

            </a-tabs></div>
    </div>
</div>
</template>

<script setup>

import {onMounted,ref} from "vue"
import { useRoute } from 'vue-router';
const route = useRoute();
onMounted(() => {
console.log("获取到的参数",route.query.subPerson);
	})



const activeKey = ref('1');

const listOne = [
    { title: '客户名称', msg: "深圳市亿恩科技有限公司" },
    { title: '系统编号', msg: "KH20190324010001" },
    { title: '客户类型', msg: "企业" },
    { title: '所属行业', msg: "电子商务" },
    { title: '客户星级', msg: "★★★★☆" },
    { title: '客户来源', msg: "电话营销" },
    { title: '客户状态', msg: "正在跟进" },
    { title: '客户归属', msg: "赵小刚（已锁定，保护到期时间10/30）" },
]
const listTwo = [
    { title: '联系人姓名', msg: "李晓红" },
    { title: '手机号', msg: "18888888888" },
    { title: '角色', msg: "决策人" },
    { title: '部门职务', msg: "部门经理" },
    { title: '生日', msg: "1984-06-22" },
    { title: '电子邮箱', msg: "windir@axureux.com" },
    { title: '固定电话', msg: "0755-88888888" },
    { title: '传真电话', msg: "0755-88888888" },
]

//资料详情
const ListKe = [
    { title: '客户名称', msg: "深圳市亿恩科技有限公司" },
    { title: '助记名称', msg: "-" },
    { title: '客户类型', msg: "企业客户" },
    { title: '所属行业', msg: "电子商务" },
    { title: '客户星级', msg: "★★★★☆" },
    { title: '客户来源', msg: "电话营销" },
    { title: '客户状态', msg: "正在跟进" },
    { title: '客户归属', msg: "赵小刚（已锁定，保护到期时间10/30）" },
]
const ListFu = [
    { title: '所在地区', msg: "广东省深圳市" },
    { title: '详细地址', msg: "罗湖区泥岗东路" },
    { title: '企业规模', msg: "10-20人" },
    { title: '上级客户', msg: "深圳市亿恩科技有限公司" },
    { title: '下级客户', msg: "10" },
    { title: '备注信息', msg: "-" },

]
const ListCai = [
    { title: '已成交金额', msg: "￥10.000.00" },
    { title: '已回款金额', msg: "￥10.000.00" },
    { title: '已开票金额', msg: "￥10.000.00" },
    { title: '未开票金额', msg: "￥10.000.00" },
    { title: '潜在交易金额', msg: "￥10.000.00" },
    { title: '费用总金额', msg: "￥10.000.00" },

]
const ListXi = [
    { title: '系统编号', msg: "KH20190324010001" },
    { title: '协作人员', msg: "李小明，陈小红，曾小芳" },
    { title: '所属部门', msg: "销售一部" },
    { title: '创建人员', msg: "赵小刚" },
    { title: '创建时间', msg: "2019-03-15 17：27" },
    { title: '更新时间', msg: "2019-03-15 17：27" },
    { title: '最后跟进', msg: "2019-03-15 17：27" },
    { title: '下次跟进', msg: "2019-03-15 17：27" },

]

// 联系人
const columns = [

    {
        title: '联系人姓名',
        dataIndex: 'firstname',
        key: 'firstname',

    },
    {
        title: '手机号',
        dataIndex: 'phone',
        key: 'phone',
    },
    {
        title: '角色',
        dataIndex: 'role',
        key: 'role',
    },
    {
        title: '部门职务',
        dataIndex: 'duties',
        key: 'duties',
    },
    {
        title: '生日',
        dataIndex: 'birthday',
        key: 'birthday',
    },

    {
        title: '操作',
        dataIndex: 'cao',
        key: 'cao'
    },

];
// const tabelData = [
//     {
//         "id": 1,
//         "status": "准备付款",
//         "star": 2,
//         "firstname": "文桂英",
//         "phone": "18675462657",
//         "endtime": "2007-07-26 05:23:14",
//         "day": 21,
//         "front": "崔艳",
//         "nexttime": "2014-07-27 00:52:24",
//         "role": "决策者",
//         "birthday": "2019-04-04 15:23:15",
//         "duties": "市场部经理",
//         "business": "商机标题",
//         "stage": "确认需求",
//         "record": 7,
//         "recordPrice": 60719,
//         "title": "飞又机公司"
//     },
//     {
//         "id": 2,
//         "status": "已经购买",
//         "star": 3,
//         "firstname": "沈明",
//         "phone": "18123321798",
//         "endtime": "1997-07-27 07:52:45",
//         "day": 18,
//         "front": "陆艳",
//         "nexttime": "1996-11-18 17:49:45",
//         "role": "员工",
//         "birthday": "1986-03-03 12:53:17",
//         "duties": "销售部经理",
//         "business": "商机标题",
//         "stage": "初步洽谈",
//         "record": 8,
//         "recordPrice": 34602,
//         "title": "细交公司"
//     },
//     {
//         "id": 3,
//         "status": "暂时搁置",
//         "star": 3,
//         "firstname": "段丽",
//         "phone": "18131362843",
//         "endtime": "2000-12-20 00:59:47",
//         "day": 21,
//         "front": "范军",
//         "nexttime": "1977-12-04 21:07:15",
//         "role": "员工",
//         "birthday": "2012-07-24 01:40:15",
//         "duties": "市场部经理",
//         "business": "商机标题",
//         "stage": "确认需求",
//         "record": 1,
//         "recordPrice": 36091,
//         "title": "转成查公司"
//     },
//     {
//         "id": 4,
//         "status": "已经购买",
//         "star": 3,
//         "firstname": "朱秀英",
//         "phone": "19866178260",
//         "endtime": "1989-04-18 07:36:24",
//         "day": 10,
//         "front": "贺敏",
//         "nexttime": "2017-11-24 15:34:18",
//         "role": "员工",
//         "birthday": "2005-06-20 02:14:04",
//         "duties": "财务部经理",
//         "business": "商机标题",
//         "stage": "选择方案",
//         "record": 8,
//         "recordPrice": 91211,
//         "title": "许线器以公司"
//     },
//     {
//         "id": 5,
//         "status": "准备付款",
//         "star": 3,
//         "firstname": "康明",
//         "phone": "18655137724",
//         "endtime": "1982-12-19 01:14:11",
//         "day": 11,
//         "front": "常超",
//         "nexttime": "1989-12-29 00:09:51",
//         "role": "决策者",
//         "birthday": "2009-01-10 19:46:04",
//         "duties": "财务部经理",
//         "business": "商机标题",
//         "stage": "签订合同",
//         "record": 1,
//         "recordPrice": 83992,
//         "title": "头党看公司"
//     },
//     {
//         "id": 6,
//         "status": "准备付款",
//         "star": 5,
//         "firstname": "袁磊",
//         "phone": "18657647725",
//         "endtime": "1973-08-02 18:46:21",
//         "day": 28,
//         "front": "黄桂英",
//         "nexttime": "1995-05-09 23:20:03",
//         "role": "员工",
//         "birthday": "2007-03-16 09:39:28",
//         "duties": "销售部经理",
//         "business": "商机标题",
//         "stage": "初步洽谈",
//         "record": 5,
//         "recordPrice": 42455,
//         "title": "中专公司"
//     },
//     {
//         "id": 7,
//         "status": "准备付款",
//         "star": 1,
//         "firstname": "邹军",
//         "phone": "18125536547",
//         "endtime": "2006-08-21 21:10:50",
//         "day": 20,
//         "front": "袁敏",
//         "nexttime": "2018-06-23 16:44:16",
//         "role": "决策者",
//         "birthday": "1986-09-05 20:41:08",
//         "duties": "销售部经理",
//         "business": "商机标题",
//         "stage": "选择方案",
//         "record": 6,
//         "recordPrice": 24087,
//         "title": "代金国例公司"
//     },
//     {
//         "id": 8,
//         "status": "准备付款",
//         "star": 1,
//         "firstname": "叶刚",
//         "phone": "19885250012",
//         "endtime": "2023-04-28 19:32:21",
//         "day": 11,
//         "front": "白霞",
//         "nexttime": "1984-05-28 23:51:16",
//         "role": "决策者",
//         "birthday": "1985-04-12 09:57:21",
//         "duties": "市场部经理",
//         "business": "商机标题",
//         "stage": "选择方案",
//         "record": 6,
//         "recordPrice": 31938,
//         "title": "众石公司"
//     },
//     {
//         "id": 9,
//         "status": "正在试用",
//         "star": 4,
//         "firstname": "何芳",
//         "phone": "18134385287",
//         "endtime": "1996-08-03 03:17:14",
//         "day": 5,
//         "front": "罗秀英",
//         "nexttime": "1996-10-11 15:22:22",
//         "role": "决策者",
//         "birthday": "1976-05-10 16:50:07",
//         "duties": "销售部经理",
//         "business": "商机标题",
//         "stage": "签订合同",
//         "record": 5,
//         "recordPrice": 98387,
//         "title": "所布车公司"
//     },
//     {
//         "id": 10,
//         "status": "准备购买",
//         "star": 3,
//         "firstname": "贺明",
//         "phone": "18138764720",
//         "endtime": "2000-08-19 23:45:49",
//         "day": 8,
//         "front": "冯静",
//         "nexttime": "1994-09-30 00:45:26",
//         "role": "决策者",
//         "birthday": "1991-06-13 14:16:56",
//         "duties": "销售部经理",
//         "business": "商机标题",
//         "stage": "确认需求",
//         "record": 6,
//         "recordPrice": 97716,
//         "title": "该化公司"
//     }
// ]

</script>

<style lang="scss" scoped>
.bgc{
    background-color: white;
}
.ull{
margin-left: 120px;
padding-top: 50px;
}
.AAQ{
    background-color: rgb(245, 245, 245);
}
.topSS>ul>li>span{
    display: inline-block;
    width: 200px;
    height: 40px;
    line-height: 40px;
    border: 1px solid gray;
    text-align: center;
}


.xian{
    width: 700px;
    height: 6px;
    background-color: rgb(75, 206, 208);
}
.text1{
    margin-top: -10px;
    margin-left: 20px;
    color: gray;
    font-size: 12px;
}
.text{
    margin-left: 35px;
    margin-top: 5px;
}
.user{
    width: 45px;
    height: 45px;
}
.topS{
    display: flex;
    justify-content: space-evenly;
    width: 1100px;
    height: 130px;
    background-color:white;
    margin: 0 auto;
    margin-top: 20px;
    align-items: center;
}

.topSS{
    width: 1100px;
    height: 250px;
    background-color:white;
    margin: 0 auto;
    margin-top: 20px;
    align-items: center;
}
.left_user>img{
    margin-left: 50px;
    margin-top: 20px;
}


.cusDetails {
    .top {

        background-color: white;
        padding: 20px 20px;
        margin: 10px 0px;

        .top_t {
            display: flex;
            align-items: center;
            margin: 10px 0px;


            .top_h {
                font-weight: bold;
                margin: 0px;
            }

            .icon {
                width: 15px;
                height: 15px;
                margin: 0px 10px;
            }

            .top_span:hover {
                color: rgb(51, 148, 254);
            }
        }

        .top_ul {
            display: flex;
            padding: 10px 0px;
            font-size: 12px;

            li {
                margin: 0px 10px;


                span {
                    color: black;
                }
            }
        }

        .top_btn {
            display: flex;



            .icon {
                height: 10px !important;
                width: 10px;

            }
        }
    }

    .con {
        background-color: white;
        margin-top: 30px;
        //概况信息
        .cons {
            padding: 30px;

            // 客户状态
            .ul_ke {
                // margin: 0px 40px;
                margin-top: 30px;
                border-left: 1px solid #eee;
                // padding: 20px 0px;

                .lia {
                    margin: 10px 0px 10px 30px;
                    padding: 15px 40px;
                    position: relative;

                    background-color: rgb(247, 251, 254);
                    border: 1px solid rgb(215, 232, 244);

                    .svg {
                        position: absolute;
                        left: -38px;
                        top: -5px;
                    }

                    &:hover {
                        .btn_tn {
                            display: block !important;
                        }

                    }

                    .lia_top {
                        display: flex;
                        justify-content: space-between;

                        .lia_left {
                            display: flex;
                            align-items: center;
                        }

                        .lia_right {
                            display: flex;
                            align-items: center;
                        }
                    }

                    .lia_con {
                        padding: 15px 0px;

                    }

                    .lia_btn {
                        font-size: 13px;
                        display: flex;
                        justify-content: space-between;
                        height: 30px;

                        .btn_tn {
                            display: none;


                        }
                    }
                }



            }
        }

    }
}
</style>